.grow-box {
  display: flex;
  /* 横向的从右开始 */
  flex-direction: row-reverse;
  width: 500px;
  height: 100px;
}
.grow-box div:nth-of-type(1) {
  flex-grow: 1;
}
.grow-box div:nth-of-type(2) {
  flex-grow: 1;
}
.grow-box div:nth-of-type(3) {
  flex-grow: 1;
}
.grow-box div:nth-of-type(4) {
  flex-grow: 2;
}
.grow-box div:nth-of-type(5) {
  flex-grow: 2;
}
.shrink-box {
  display: flex;
  /* 横向的从右开始 */
  flex-direction: row-reverse;
  width: 500px;
  height: 100px;
}
.shrink-box div:nth-of-type(1) {
  width: 120px;
  flex-shrink: 4;
}
.shrink-box div:nth-of-type(2) {
  width: 120px;
  flex-shrink: 4;
}
.shrink-box div:nth-of-type(3) {
  width: 120px;
  flex-shrink: 1;
}
.shrink-box div:nth-of-type(4) {
  width: 120px;
  flex-shrink: 1;
}
.shrink-box div:nth-of-type(5) {
  width: 120px;
  flex-shrink: 1;
}
.basis-box {
  display: flex;
  /* 横向的从右开始 */
  flex-direction: row-reverse;
  width: 500px;
  height: 100px;
}
.basis-box div {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 40px;
}
.basis-box div:nth-of-type(1) {
  flex-basis: 100px;
}
